<#import '/ftlLibrary/properteisVariable.ftl' as pv/>
<link href="assets/css/bootstrap-select.css" rel="stylesheet" />
<link href="assets/css/front/listCommonStyle.css" rel="stylesheet"/>
<link href="assets/css/modify.css" rel="stylesheet"/>
<script src="assets/js/select2/select2.js"></script>
<style>
    .bootbox-close-button {
        width: 19px;
        height: 19px;
        border: none;
        cursor: pointer;
        -webkit-appearance: none;
        float: right;
        top: 4px;
        left: -5px;
        position: relative;
        background: #E9F5FF url("assets/img/nav-img/icon_close.png") no-repeat 0 0;
    }
</style>
<div class="row" style="margin-left: 0px!important;">
    <!-- 映射列表 -->
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" id="leftTree">
        <div class="widget flat radius-bordered">
            <div class="widget-header bg-sky theme">
                <span class="widget-caption">亲子班级考勤</span>
                <input type="hidden" name="type" value="${type}">
            </div>
            <div class="widget-body no-padding" style="background-color: #fff;">
                <div class="topPagingBar text-align-center" style="font-size: 14px;margin-bottom: 20px;margin-top: 20px;color: #15A4FA;">
                    ${(byDetached[0].courseName???string(byDetached[0].courseName?html,"未设置"))!'未设置'}&nbsp;&nbsp;
                    ${(byDetached[0].classRoomName???string(byDetached[0].classRoomName?html,"未设置"))!'未设置'}&nbsp;&nbsp;
                    ${(byDetached[0].realName???string(byDetached[0].realName?html,"未设置"))!'未设置'}&nbsp;&nbsp;
                    ${sumAttendance}/${sumPeople}(出勤率${ratio}%)
                </div>
                <div class="table-scrollable">
                    <!-- 数据表列信息列表 -->
                    <table class="table table-bordered dataTable ">
                        <thead>
                        <tr>
                            <th title="选择" class="checkboxColumnTh fixedColumn " >
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" class="chkAll chkAllClickDisabled">
                                        <span class="text"></span>
                                    </label>
                                </div>
                            </th>
                            <th title="属性名">序号</th>
                            <th class="fixedColumn" style="width: 100px">操作项</th>
                            <th title="会员姓名">会员姓名</th>
                            <th title="联系电话">联系电话</th>
                            <th title="单节耗课">单节耗课</th>
                            <th title="考勤状态">考勤状态</th>
                            <th title="备注">备注</th>
                            <th title="当前操作者">操作人</th>
                            <th title="操作日期">操作日期</th>
                        </tr>
                        </thead>
                        <tbody class="chkAllClickTbody">
                        <#if byDetached?size==0>
                            <tr>
                                <td align="center">无数据</td>
                            </tr>
                        </#if>
                        <@dictionary groupCode="attendenceStatus";dics>
                        <#list byDetached as data>
                            <tr>
                                <td class="checkboxColumnTd">
                                    <div class="checkbox">
                                        <label>
                                            <input type="checkbox" class="chk isChk" name="chk"  value="${data.id}" createTime="${data.memberCheckAttendanceCreateTime}">
                                            <span class="text"></span>
                                        </label>
                                    </div>
                                </td>
                                <!--<td>${data_index+1+(page_bean.pageNo-1)*page_bean.pageSize}</td>-->
                                <td>${data_index+1}</td>
                                <td align="center">
                                    <!--<a class="btn btn-default btn-xs icon-only green update" href="javascript:void(0);"  serializeNum="${serializeNum}" editUrl="${editUrl}" targetDataId="${data.id}"><i class="fa  fa-edit"></i></a>
                                    <a class="btn btn-default btn-xs icon-only red delete" href="javascript:void(0);"   serializeNum="${serializeNum}" deleteUrl="${deleteUrl}" targetDataId="${data.id}"><i class="fa fa-trash-o"></i></a>

                                    <@hp code="KHMD24277389291454-memerbetAdd" params="[serializeNum=${serializeNum},targetDataId=${data.id},targetName=${data.name}]"/>

                                    <@hp code="KHMD24277389291454-allocationAdd" params="[serializeNum=${serializeNum},targetDataId=${data.id},targetName=${data.name}]"/>

                                    <@hp code="KHMD24277389291454-depositAdd" params="[serializeNum=${serializeNum},targetDataId=${data.id}]"/>-->
                                    <#if data.memberCheckAttendanceStatus== 0>
                                        <a href="javascript:void(0);" onclick="attendance(this)" cid=${data.id} status="1"
                                           classId=${data.memberCheckAttendanceClassId} type=${data.classesType}
                                           memberId=${data.memberCheckAttendanceMemberId} expendClassHour=${data.classesExpendClassHour}
                                           createTime=${data.memberCheckAttendanceCreateTime} lessonsId="${data.lessonsId}">出勤</a>
                                        <a href="javascript:void(0);" onclick="absenteeism(this)" cid=${data.id}
                                           studentName=${data.studentName}  flag="1"
                                           classId=${data.memberCheckAttendanceClassId} type=${data.classesType}
                                           memberId=${data.memberCheckAttendanceMemberId} expendClassHour=${data.classesExpendClassHour}
                                           createTime=${data.memberCheckAttendanceCreateTime} lessonsId="${data.lessonsId}">缺勤</a>
                                    </#if>
                                    <#if data.memberCheckAttendanceStatus== 1>
                                        <a href="javascript:void(0);" onclick="absenteeism(this)" cid=${data.id}
                                           studentName=${data.studentName}  flag="2"
                                           classId=${data.memberCheckAttendanceClassId} type=${data.classesType}
                                           memberId=${data.memberCheckAttendanceMemberId} expendClassHour=${data.classesExpendClassHour}
                                           createTime=${data.memberCheckAttendanceCreateTime} lessonsId="${data.lessonsId}">修改</a>
                                    </#if>
                                    <#if data.memberCheckAttendanceStatus== 2>
                                    </#if>
                                    <#if data.memberCheckAttendanceStatus== 4>
                                    </#if>
                                    <#if data.memberCheckAttendanceStatus== 3>
                                        <a href="javascript:void(0);" onclick="absenteeism(this)" cid=${data.id}
                                           studentName=${data.studentName}  flag="2"
                                           classId=${data.memberCheckAttendanceClassId} type=${data.classesType}
                                           memberId=${data.memberCheckAttendanceMemberId} expendClassHour=${data.classesExpendClassHour}
                                           createTime=${data.memberCheckAttendanceCreateTime} lessonsId="${data.lessonsId}">修改</a>
                                    </#if>
                                </td>
                                <td>${(data.studentName???string(data.studentName?html,"未设置"))!'未设置'}</td>
                                <td>${(data.studentContactPhone???string(data.studentContactPhone?html,"未设置"))!'未设置'}
                                </td>
                                <td>
                                    ${(data.classesExpendClassHour???string(data.classesExpendClassHour?html,"未设置"))!'未设置'}
                                </td>
                                <td>
                                    ${(data.memberCheckAttendanceStatus???string(data.memberCheckAttendanceStatus?html,"未设置"))!'未设置'}
                                </td>

                                <td>
                                    <!--${(data.memberCheckAttendanceRemark???string(data.memberCheckAttendanceRemark?html,""))!'未设置'}-->
                                    <!--<a href="javascript:void(0);"  onclick="classAttendance(this)" memberCheckAttendanceClassId="12345678901234567890123456789012">备注</a>-->
                                    <input style="border:0px solid #000;text-align: center" type="text" name="remark" cid="${data.id}" lessonsId="${data.lessonsId}" value="${data.memberCheckAttendanceRemark}"
                                           classId="${data.memberCheckAttendanceClassId}" type="${data.classesType}" createTime="${data.memberCheckAttendanceCreateTime}" placeholder="请输入备注信息"
                                           onblur="Remarks(this)">
                                </td>
                                <td>${(data.employeeName???string(data.employeeName?html,"未设置"))!'未设置'}</td>
                                <td>
                                    ${(data.memberCheckAttendanceCreateTime???string(data.memberCheckAttendanceCreateTime?html,"未设置"))!'未设置'}
                                </td>
                            </tr>
                        </#list>
                        </@dictionary>
                        </tbody>
                    </table>
                </div>
            </div>
            <div class="topPagingBar text-align-center" style="font-size: 14px;margin-top: 20px">
                <button onclick="classAttendance(this)" classId="12345678901234567890123456789012"
                        class="btn btn-blue margin-right-20" style="width: 100px">导出考勤表
                </button>
                <!--<a href="javascript:void(0);"  onclick="classAttendance(this)" classId="12345678901234567890123456789012">导出考勤表</a>-->
                <button onclick="batchAttendance(this)" lessonsId="${byDetached[0].lessonsId}"
                        type=${byDetached[0].classesType}  class="btn btn-blue" style="width: 100px">批量考勤
                </button>
                <!--<a href="javascript:void(0);"  onclick="batchAttendance(this)" classId=${page_bean.list[0].memberCheckAttendanceClassId} type=${page_bean.list[0].classesType}>批量考勤</a>-->
            </div>
        </div>
    </div>
</div>
<script>
    $(".selectpicker").select2();

    /**
     * 备注修改
     * @param that
     */
    function Remarks(that) {
        var remark = $(that).val();
        var id = $(that).attr("cid");
        var classId = $(that).attr("classId");
        var type = $(that).attr("type");
        var createTime = $(that).attr("createTime");
        var lessonsId = $(that).attr("lessonsId");
        var size = $("#toast-container").size();
        if (remark.length > 10) {
            logger.error("请输入少于10个字备注");
            $(that).val(remark.substr(0, 10))
        } else {
            ajaxRequest("tssMemberCheckAttendanceController/Remarks.do", {
                remark: remark,
                id: id
            }, function (result) {
                var jsondatas=eval("("+result+")");
                if(jsondatas.indexOf("200")>0){
                   logger.info("备注保存成功",true)
                }
            }, function () {
                ajaxError("加载页面失败!")
            }, "get", "html")
        }
    }



    /**
     * 批量考勤
     * @param that
     */
    function batchAttendance(that) {
        var lessonsId = $(that).attr("lessonsId");
        var type = $(that).attr("type");
        var htmlTitle = "";
        var ids = new Array();
        var i = 0;
        var createTime ;
        $("input[name='chk']:checked").each(function () {
            ids[i] = $(this).val();
            createTime = $(that).attr("createTime");
            console.log(createTime);
            i++;
        });
        //alert(ids);
        if(ids.length > 0){
            messageValue = '您确定将选中的亲子会员'+ids.length+'人全部标为已出勤状态吗？';
            getTopWin().bootbox.dialog({
                title: '<i class="fa fa-lock red"></i>&nbsp;&nbsp;批量考勤',
                message: messageValue,
                closeButton: true,
                buttons: {
                    "确定": {
                        className: "btn-blue",
                        callback: function () {
                            ajaxRequest("tssMemberCheckAttendanceController/batchAttendance.do", {
                                ids: ids,
                                lessonsId:lessonsId,
                                type:type
                            }, function (result) {

                                console.log(result)
                                bootbox.hideAll();
                                ajaxRequest("tssMemberCheckAttendanceController/tssMemberCheckAttendanceClass.do", {
                                    lessonsId:lessonsId
                                }, function (html) {
                                    if (type == 1) {
                                        htmlTitle = "班级考勤(亲子)"
                                    }
                                    if (type == 2) {
                                        htmlTitle = "班级考勤(过渡)"
                                    }
                                    getTopWin(html).bootbox.dialog({
                                        message: html,
                                        title: htmlTitle,
                                        className: 'myDialog tssMemberCheckAttendanceDialog'
                                    });
                                    $(".modal-header").find(".bootbox-close-button").removeClass("close");
                                    $(".modal-header").find(".bootbox-close-button").html("");
                                }, function () {
                                    ajaxError("加载页面失败!")
                                }, "get", "html")
                            }, function () {
                                ajaxError("加载页面失败!")
                            }, "get", "html")
                        }
                    }


                }
            });
        }else{
            logger.error("请选择需要批量处理的选项")
        }
    }

    $(function(){
        $(".isChk").each(function () {
            var val = $(this).parents(".checkboxColumnTd").next().next().next().next().next().next().html().trim()
            if(val!=0){
                $(this).prop("disabled",true);
            }
        })
    });

    $(".chkAllClickDisabled").click(function () {
        setTimeout(function () {
            $(".chkAllClickTbody").find(".isChk").each(function () {
                if($(this).prop("disabled")){
                    $(this).prop("checked",false)
                }
            })
        },100)
    })

    /**
     * 出勤
     * @param that
     */
    function attendance(that) {
        var cid = $(that).attr("cid");
        var status = $(that).attr("status");
        var classId = $(that).attr("classId");
        var memberId = $(that).attr("memberId");
        var expendClassHour = $(that).attr("expendClassHour");
        var type = $(that).attr("type");
        var createTime = $(that).attr("createTime");
        var lessonsId = $(that).attr("lessonsId");
        var htmlTitle = "";
        ajaxRequest("tssMemberCheckAttendanceController/attendance.do", {
            type:type,
            id: cid,
            attendenceStatus: status,
            classId: classId,
            memberId:memberId,
            expendClassHour:expendClassHour,
            createTime:createTime,
            lessonsId:lessonsId
        }, function () {
            getTopWin().bootbox.dialog({
                title: '出勤',
                message: "考勤成功!",
                className: 'attendanceDialog tssMemberCheckDialog',
                buttons: {
                    "确定": {
                        className: "btn-blue",
                        callback: function () {
                            bootbox.hideAll();
                            ajaxRequest("tssMemberCheckAttendanceController/tssMemberCheckAttendanceClass.do", {
                                lessonsId: lessonsId,
                                type:type
                            }, function (html) {
                                if (type == 1) {
                                    htmlTitle = "班级考勤(亲子)"
                                }
                                if (type == 2) {
                                    htmlTitle = "班级考勤(过渡)"
                                }
                                getTopWin(html).bootbox.dialog({
                                    message: html,
                                    title: htmlTitle,
                                    className: 'myDialog tssMemberCheckAttendanceDialog'
                                });
                                $(".modal-header").find(".bootbox-close-button").removeClass("close");
                                $(".modal-header").find(".bootbox-close-button").html("");
                            }, function () {
                                ajaxError("加载页面失败!")
                            }, "get", "html")
                        }
                    }

                }
            });
        }, function () {
            ajaxError("加载页面失败!")
        }, "get", "html")

    }

    /**
     * 缺勤
     * @param that
     */
    function absenteeism(that) {
        var cid = $(that).attr("cid");
        var studentName = $(that).attr("studentName");
        var studentType = $(that).attr("studentType");
        var flag = $(that).attr("flag");
        var studentTypename = "";
        var htmlvalue = "";
        var classId = $(that).attr("classId");
        var type = $(that).attr("type");
        var createTime = $(that).attr("createTime");
        var lessonsId = $(that).attr("lessonsId");
        var htmlTitle = "";

        if (type == "1") {
            if (flag == 1) {
                htmltitle = "缺勤确认";
                htmlvalue = '<div class="radio">\n' +
                    '           <label>\n' +
                    '               <input type="radio"  name="status" value="2" >\n' +
                    '               <span class="text" style="margin-top:6px">不扣课时</span>\n' +
                    '           </label>\n' +
                    '           <label>\n' +
                    '               <input type="radio" name="status" value="3">\n' +
                    '               <span class="text" style="margin-top:6px">扣课时可补课</span>\n' +
                    '           </label>\n' +
                    '        </div>'
            }
            if (flag == 2) {
                htmltitle = "修改考勤"
                htmlvalue = '<div class="radio">\n' +
                    '           <label>\n' +
                    '               <input type="radio"  name="status" value="1" >\n' +
                    '               <span class="text" style="margin-top:6px">出勤</span>\n' +
                    '           </label>\n' +
                    '           <label>\n' +
                    '               <input type="radio"  name="status" value="2" >\n' +
                    '               <span class="text" style="margin-top:6px">缺勤</span>\n' +
                    '           </label>\n' +
                    '           <label>\n' +
                    '               <input type="radio" name="status" value="3">\n' +
                    '               <span class="text" style="margin-top:6px">扣课时可补课</span>\n' +
                    '           </label>\n' +
                    '        </div>'
            }
            studentTypename = "亲子会员";

            getTopWin().bootbox.dialog({
//            '<i class="fa fa-lock red"></i>&nbsp;&nbsp;'
                title: htmltitle,
                message: '<div><span>确定将' + studentTypename + studentName + '标为缺勤吗？</span></div>' + htmlvalue,
                closeButton: true,
                buttons: {
                    "确定": {
                        className: "btn-blue",
                        callback: function () {
                            var status = $("input:radio[name='status']:checked").val();
                            ajaxRequest("tssMemberCheckAttendanceController/attendance.do", {
                                id: cid,
                                attendenceStatus: status,
                                createTime:createTime,
                                classId:classId,
                                type:type,
                                lessonsId:lessonsId
                            }, function () {
                                getTopWin().bootbox.dialog({
                                    message: "考勤成功!",
                                    title: "考勤成功!",
                                    className: 'absenteeismDialog',
                                    buttons: {
                                        "确定": {
                                            className: "btn-blue",
                                            callback: function () {
                                                bootbox.hideAll();
                                                ajaxRequest("tssMemberCheckAttendanceController/tssMemberCheckAttendanceClass.do", {
                                                    lessonsId: lessonsId,
                                                    type:type
                                                }, function (html) {
                                                    if (type == 1) {
                                                        htmlTitle = "班级考勤(亲子)"
                                                    }
                                                    if (type == 2) {
                                                        htmlTitle = "班级考勤(过度)"
                                                    }
                                                    getTopWin(html).bootbox.dialog({
                                                        message: html,
                                                        title: htmlTitle,
                                                        className: 'myDialog tssMemberCheckAttendanceDialog'
                                                    });
                                                    $(".modal-header").find(".bootbox-close-button").removeClass("close");
                                                    $(".modal-header").find(".bootbox-close-button").html("");
                                                }, function () {
                                                    ajaxError("加载页面失败!")
                                                }, "get", "html")
                                            }
                                        }
                                    }
                                });
                            }, function () {
                                ajaxError("加载页面失败!")
                            }, "get", "html")
                        }
                    },

                    "取消": {
                        className: "btn-blue",
                        callback: function () {
                            return false;
                        }
                    }
                }
            });
        }
        if (type == "2") {
            studentTypename = "过度会员";
            html = "";
            if (flag == 1) {
                htmltitle = "缺勤";
            }
            if (flag == 2) {
                htmltitle = "修改考勤"
                htmlvalue = '<div class="radio">\n' +
                    '           <label>\n' +
                    '               <input type="radio"  name="status" value="2" >\n' +
                    '               <span class="text" style="margin-top:6px">出勤</span>\n' +
                    '           </label>\n' +
                    '           <label>\n' +
                    '               <input type="radio"  name="status" value="3" >\n' +
                    '               <span class="text" style="margin-top:6px">缺勤</span>\n' +
                    '           </label>\n' +
                    '        </div>'
            }
            getTopWin().bootbox.dialog({
                title: htmltitle,
                message: '<div><span>确定将' + studentTypename + studentName + '标为缺勤吗？</span></div>'+ htmlvalue,
                closeButton: true,
                buttons: {
                    "确定": {
                        className: "btn-blue",
                        callback: function () {
                            var status = $("input:radio[name='status']:checked").val();
                            if(flag == 1){
                                var status = 2;
                            }
                            ajaxRequest("tssMemberCheckAttendanceController/attendance.do", {
                                id: cid,
                                attendenceStatus: status,
                                createTime:createTime,
                                type:type,
                                lessonsId:lessonsId
                            }, function () {
                                getTopWin().bootbox.dialog({
                                    message: "考勤成功!",
                                    title: "考勤成功!",
                                    className: 'absenteeismDialog',
                                    buttons: {
                                        "确定": {
                                            className: "btn-blue",
                                            callback: function () {
                                                bootbox.hideAll();
                                                ajaxRequest("tssMemberCheckAttendanceController/tssMemberCheckAttendanceClass.do", {
                                                    lessonsId: lessonsId,
                                                    type:type
                                                }, function (html) {
                                                    if (type == 1) {
                                                        htmlTitle = "班级考勤(亲子)"
                                                    }
                                                    if (type == 2) {
                                                        htmlTitle = "班级考勤(过度)"
                                                    }
                                                    getTopWin(html).bootbox.dialog({
                                                        message: html,
                                                        title: htmlTitle,
                                                        className: 'myDialog tssMemberCheckAttendanceDialog'
                                                    });
                                                    $(".modal-header").find(".bootbox-close-button").removeClass("close");
                                                    $(".modal-header").find(".bootbox-close-button").html("");
                                                }, function () {
                                                    ajaxError("加载页面失败!")
                                                }, "get", "html")
                                            }
                                        }
                                    }
                                });
                            }, function () {
                                ajaxError("加载页面失败!")
                            }, "get", "html")
                        }
                    },

                    "取消": {
                        className: "btn-blue",
                        callback: function () {
                            return false;
                        }
                    }
                }
            });
        }



    }


</script>


